<route lang="json5">
{
  style: {
    navigationStyle: 'custom',
    navigationBarTitleText: '扫码',
  },
}
</route>

<template>
  <view class="min-h-screen bg-#42bac0">
    <!-- 顶部区域 -->
    <view
      class="relative w-full h-160 bg-cover bg-center rounded-b-3xl overflow-hidden"
      style="background-image: url('https://kuaidi.trio.pub/upload/uniapp/delivery/scanbj.jpg')"
    >
      <!-- 返回按钮 -->
      <view class="absolute top-10 left-4" @click="goBack">
        <view class="i-carbon-arrow-left text-white text-2xl"></view>
      </view>
      <!-- 标题 -->
      <view
        class="absolute top-10 left-1/2 transform -translate-x-1/2 text-white text-lg font-medium"
      >
        扫码开柜
      </view>
    </view>

    <!-- 底部开柜区域 -->
    <view class="px-4 fixed bottom-8 left-0 right-0">
      <!-- <view class="text-center mb-3 text-gray-600">开柜码：0489</view> -->
      <button class="w-full bg-#51696d text-#fff py-3 rounded-lg" @click="handleOpenCabinet">
        录入快递
      </button>
    </view>
  </view>
</template>

<script lang="ts" setup>
import { onLoad, onShow } from '@dcloudio/uni-app'

interface Package {
  count: number
  courier: string
}

const packageList: Package[] = [
  {
    count: 2,
    courier: '顺丰快递',
  },
  {
    count: 3,
    courier: '顺丰快递',
  },
  {
    count: 3,
    courier: '顺丰快递',
  },
]

let hasScanTried = false

const goBack = () => {
  uni.navigateBack()
}

const handleOpenCabinet = () => {
  scanCode()

  // uni.navigateTo({
  //   url: '/pages/Input/index',
  // })
}

// 扫码方法
const scanCode = () => {
  uni.scanCode({
    success: (res) => {
      console.log('扫码结果：', res.result)
      // 这里可以处理扫码后的逻辑
      if (res.result) {
        hasScanTried = false // 下次回到页面可以再扫码
        uni.navigateTo({
          url: '/pages/Input/index?code=' + res.result,
        })
      }
    },
    fail: (err) => {
      console.error('扫码失败：', err)
      uni.showToast({
        title: '扫码失败',
        icon: 'none',
      })
      // 用户主动返回或扫码失败，下次回到页面可以再扫码
      hasScanTried = false
    },
  })
}

// 页面加载时自动调用扫码
onLoad(() => {
  // scanCode()
  // uni.navigateTo({
  //   url: '/pages/Input/index',
  // })
})

// onShow(() => {
//   // 只在未弹出扫码时才弹
//   if (!hasScanTried) {
//     hasScanTried = true
//     scanCode()
//   }
// })
</script>

<style scoped>
page {
  background-color: #f5f5f5;
}

.bg-gradient-to-r {
  border-top-right-radius: 32px;
  border-bottom-left-radius: 32px;
}
</style>
